<template>
  <div class="box">
    <build-el-h1 name="大赛申报流程标题.png"></build-el-h1>
    <div class="flex-row list1">
      <div class="fwb info" v-html="details.contestProcess"></div>
      <!-- <div
        v-for="(item, index) in circuit.data"
        :key="index + item.icon"
        class="flex-row"
      >
        <build-el-icon-list
          :icon="item.icon"
          :t1="item.t1"
          :t2="item.t2"
          :showLine="index!=circuit.data.length-1"
        ></build-el-icon-list>

      </div>-->
    </div>
    <div class="flex-row download" v-if="0">
      <img src="../../assets/imgs/大赛文件下载按钮.png" alt srcset @click="down" />
      <img src="../../assets/imgs/参赛文件上传按钮.png" alt srcset @click="toUpload" />
    </div>
  </div>
</template>
<script>
import buildElH1 from '../build-el-h1'
import buildElIconList from '../build-el-icon-list'
import buildElLine from '../build-el-line'
import JSONData from '@/assets/JSON'
import router from '@/router'
export default {
  components: {
    buildElH1,
    buildElIconList,
    buildElLine,
  },
  props: {
    details: {
      type: Object,
      default: () => {},
    },
  },
  data() {
    return {
      ...JSONData,
    }
  },
  methods: {
    async down() {
      await this.api.downloadFiles(this.details.fileId)
    },
    toUpload() {
      router.push({
        name: 'Upload',
      })
    },
  },
}
</script>
<style lang="less" scoped>
.box {
  padding-left: calc((100vw - 1200px) / 2);
  background: #f7f7f7;
  box-sizing: content-box;
  padding: 25px 20px;
  .info {
    width: 100%;
    opacity: 0.9;
    font-size: 16px;
    color: #333333;
    letter-spacing: 0;
    line-height: 30px;
  }
  .list1 {
    flex-wrap: wrap;
  }
  .download {
    padding: 60px 0;
    img {
      .pointer;
      width: 100px;
      margin: 0 10px;
      &:first-child {
        margin-left: 90px;
      }
    }
  }
}
</style>
